load package

To start to use spsComps, load it in your Shiny app file or Rmarkdown file

library(spsComps)
## Loading required package: shiny
## Loading required package: spsUtil

So you can see it depends on shiny and spsUtil. When you load it, there is no need to additionally load shiny or spsUtil.

UI Components

For most of the UI components, you can view them in the online Shiny demo. Here we just select a few to demonstrate how you can use them in a R markdown.

spsGoTop

A go top button.

spsGoTop()

It will not be display inline of the Rmd, just simply call it and maybe change the style as you want. By default, a “go to top” button will be created on the bottom-right corner. Now scroll this page, and you should see it (the rocket button).

Logos

a panel of logos with hexPanel

Buttons

Some colorful buttons hrefTab

hrefTab(
    title = "Different background and text colors",
    label_texts = c("Go top", "Disabled", "Email me"),
    hrefs = c("#", "", "mailto:xxx@abc.com"),
    bg_colors = c("green", "#eee", "orange"),
    text_colors = c("#caffc1", "black", "blue")
)

Different background and text colors

A table colorful buttons hrefTable

hrefTable(
    title = "Change button color and text color",
    item_titles = c("workflow 1", "No links"),
    item_labels = list(c("tab 1"), c("tab 3", "tab 4")),
    item_hrefs = list(c("https://www.google.com/"), c("", "")),
    item_bg_colors =  list(c("blue"), c("red", "orange")),
    item_text_colors =  list(c("black"), c("yellow", "green")),
    style = "display: table;"
)
Change button color and text color
Category Options
workflow 1 tab 1
No links tab 3 tab 4 
hrefTable(
    title = "Change row name colors and width",
    item_titles = c("Green", "Red", "Orange"),
    item_labels = list(c("tab 1"), c("tab 3", "tab 4"), c("tab 5", "tab 6", "tab 7")),
    item_hrefs = list(
        c("https://www.google.com/"),
        c("", ""),
        c("https://www.google.com/", "https://www.google.com/", "")
    ),
    item_title_colors = c("green", "red", "orange"),
    style = "display: table;"
)
Change row name colors and width
Category Options
Green tab 1
Red tab 3 tab 4
Orange tab 5 tab 6 tab 7

The table caption is on top in Shiny but on bottom in Rmd. You may also want to add the style = "display: table;" in Rmd to make the table occupy full length of the document in R markdown.

show code with spsCodeBtn

my_code <-
'
# load package and data
library(ggplot2)
data(mpg, package="ggplot2")
# mpg <- read.csv("http://goo.gl/uEeRGu")

# Scatterplot
theme_set(theme_bw())  # pre-set the bw theme.
g <- ggplot(mpg, aes(cty, hwy))
g + geom_jitter(width = .5, size=1) +
  labs(subtitle="mpg: city vs highway mileage",
       y="hwy",
       x="cty",
       title="Jittered Points")
'
spsCodeBtn(id = "a", my_code)
spsCodeBtn(id = "c", my_code, display = "collapse")

Code to Reproduce